import React, { useRef } from 'react'
import styles from '../../styles/common/input.scss'
import { changeInputDataConfig } from '../login/Login';

interface inputConfig {
    style?: object,
    isPassword: boolean,
    type: string,
    callback?: changeInputDataConfig,
    placeholder?: string
}

export default function Input({ style, isPassword, type, callback, placeholder = '' }: inputConfig) {
    const inputRef = useRef();
    const handleChange = () => {
        callback((inputRef.current as any).value, type);
    }

    return (
        <input
            type={isPassword ? 'password' : 'text'}
            className={styles.input}
            placeholder={placeholder}
            style={style}
            onChange={() => { handleChange() }}
            ref={inputRef}
        />
    )
}
